<template>
    <div>
        <div>
            <van-row>
                <van-col span="24">
                    <van-nav-bar
                            title="主页"
                            left-text="返回"
                            left-arrow
                            @click-left="back()"
                    />
                </van-col>
            </van-row>
        </div>

        <div>
            <van-row>
                <van-col span="6">
                    <van-button type="primary" size="large" @click="xihuan()">喜欢</van-button>
                </van-col>
                <van-col span="6">
                    <van-button type="primary" size="large" @click="shoucang()">收藏</van-button>
                </van-col>
                <van-col span="6">
                    <van-button type="primary" size="large" @click="guanzhu()">关注</van-button>
                </van-col>
                <van-col span="6">
                    <van-button type="primary" size="large" @click="wode()">我的</van-button>
                </van-col>
            </van-row>
        </div>
        <div>
            <van-list
                    v-model:loading="loading"
                    :finished="finished"
                    finished-text="没有更多了"
                    @load="loadData()"
            >
                <div v-for="u in text" :key="u.id">
                    <div v-show="allshow">
                        <div>
                            <video  :src="u.dzurl" style="width: 400px;height: 300px" controls loop v-show="true"></video>
                        </div>
                       <div>
                           <van-icon class="666" @click="qx(u.id)" style="background-color: red;" name="like-o" />
                       </div>

                    </div>

                </div>

                <div v-for="u in sc">
                    <div v-show="allshow2">
                        <video  :src="u.scurl" style="width: 400px;height: 300px" controls loop v-show="true"></video>

                        <van-icon style="background-color: yellow" @click="qxsc(u.id)" name="star-o" />
                    </div>



                </div>

                <div v-for="u in gz" v-show="allshow3">
                    <div>
                        <van-swipe-cell>
                            <van-cell :border="false" :icon="u.gzimg" :title="u.gzuser"  />
                            <template #right>
                                <van-button square type="danger" text="取消关注" @click="gzqx(u.id)" />
                            </template>
                        </van-swipe-cell>
                    </div>

                </div>

                <div v-for="u in wd">
                    <div v-show="allshow4">
                        <van-cell-group>
                            <video   :src="u.url" style="width: 400px;height: 300px" controls loop v-show="true"></video>
                        </van-cell-group>
                    </div>
                </div>

            </van-list>


        </div>
    </div>
</template>

<script>
    import { Toast } from 'vant';
    export default {
        inject:['reload'],
     provide(){
       return{
          reload:this.reload
            }
     },
        data(){
           return{
               text:[],
               allshow:false,
               zj:[],
               xhsl:[],
               tags:0,
               allshow2:false,
               sc:[],
               gz:[],
               allshow3:false,
               allshow4:false,
               wd:[],
           }
        },
        methods:{
            back(){
                history.back();
            },
            loadData(){
                this.axios.get("http://localhost:8081/api/all1.do").then((response) => {
                    console.log(response.data)
                    //response.data 等同于R
                    this.text=response.data.data
                    this.zj=response.data.data.id
                    this.xhsl=response.data.data.likecount
                })
            },
            xihuan(){
                this.allshow=true
                this.allshow2=false
                this.allshow3=false
                this.allshow4=false
            },
            shoucang(){
                this.allshow=false
                this.allshow2=true
                this.allshow3=false
                this.allshow4=false
                this.axios.get("http://localhost:8081/api/all2.do").then((response) => {
                    console.log(response.data)
                    //response.data 等同于R
                    this.sc=response.data.data

                })
            },
            guanzhu(){
                this.allshow=false
                this.allshow2=false
                this.allshow3=true
                this.allshow4=false
                this.axios.get("http://localhost:8081/api/chaxun.do").then((response) => {
                    console.log(response.data)
                    //response.data 等同于R
                    this.gz=response.data.data

                })
            },
            wode(){
                this.allshow=false
                this.allshow2=false
                this.allshow3=false
                this.allshow4=true
            },
            qx(x){
                this.axios.post("http://localhost:8081/api/delect.do",{
                    "id":x
                })
                    .then(function (res) {
                        if (res.data.code==200){
                            Toast('取消喜欢');
                        }
                    })
                this.reload();
            },
            qxsc(y){
                this.axios.post("http://localhost:8081/api/scdelect.do",{
                    "id":y
                })
                    .then(function (res) {
                        if (res.data.code==200){
                            Toast('取消收藏');
                        }
                    })
                this.reload();
            },
            gzqx(z){

                this.axios.post("http://localhost:8081/api/gzdelect.do",{
                    "id":z
                })
                    .then(function (res) {
                        if (res.data.code==200){
                            Toast('取消关注');
                        }
                    })
                this.reload();
            }
        }
    }

</script>

<style scoped>

</style>